{% extends 'common/map.html' %}

{% block layersConfig %}
    // setup which kml files are shown in the data layers panel
    //options.rememberMapExtent = false; 
    //madrona.addLayer('http://d243vm3w7590ia.cloudfront.net/State/Wa_tersea/Wa_tersea.kmz', {setExtent: true});
    {% if is_public_layers %}   
        {% if camera %}
        madrona.addLayer('{% url public-data-layers %}');
        {% else %}
        madrona.addLayer('{% url public-data-layers %}', {setExtent: true});
        {% endif %}
    {% endif %}
    {% if user.is_authenticated and is_privatekml %}
    madrona.addLayer('{% url layers-privatekml-list session_key=session_key %}');            
    {% endif %}
{% endblock layersConfig %}

{% block js_ready %}
    $('a[href="#DataLayers"]').click();
    $('#signin_button').click(function(){
        $('#signin').click();
    });
    $('#register_button').click(function(){
        $('#register').click();
    });       
{% endblock %}

{% block addToOptions %} 
    $('a[href="#DataLayers"]').click();
{% endblock addToOptions %}

{% block datalayers %}
<div id="DataLayers">
    {% if user.is_authenticated %}
    {% else %}
        <div class="box" style="margin-top:20px;">
            <h1> Washington Marine Planner </h1>
            <p> The Washington Marine Planner is a pilot project intended to support the state's 
                <a href="http://www.ecy.wa.gov/programs/sea/msp/index.html" target="_blank">Marine Spatial Planning (MSP)</a> process
                and the Pacific County <a href="http://www.ecy.wa.gov/programs/sea/shorelines/smp/index.html" target="_blank">Shoreline Master Plan (SMP)</a> 
                data and inventory characterization.</p>
            <p style="margin-bottom:0px"> The Data Layers below are available to all users. 
            <p style="margin-top:1px; margin-bottom:3px">Registering with the site will, additionally, allow you to: 
                <ul class="wmp">
                    <li>Site <img src='/media/wmm/img/multi.png' width="12px" height="12px"/> Scenarios for renewable energy and conservation uses</li>
                    <li>Design <img src='/media/wmm/img/aoi.png' width="12px" height="12px"/> Areas and 
                        <img src='/media/wmm/img/smp.png' width="12px" height="12px"/> SMPs for analysis</li>
                    <li>Analyze your Areas for <img src='/media/wmm/img/analysis.png' width="12px" height="12px"/> Tradeoffs between the various objectives</li>
                </ul>
            </p>
            <div>
            <a href="#" class="button" id="register_button"><span>Register</span></a>
            <a href="#" class="button" id="signin_button"><span>Sign In</span></a>
            <br class="clear" />
            </div>
        </div>
        <div class="box">
    {% endif %}
    <h1> Data Layers </h1>
    <div id="datalayerstree" style="margin-left:10px;"></div>
    {% if user.is_authenticated %}
    {% else %}
        </div>
    {% endif %}
</div>
<style type="text/css">
h1 {
    margin-top: 5px;
}
ul.wmp {
    padding-left: 25px;
    margin-top: 0px;
    color: #4C4C4C;
    font-size: 12px;
    font-family: "Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
}
ul.wmp li {
    margin-bottom:3px;
}
</style>
{% endblock datalayers %}

{% block metanavigation %}
{% if user.is_authenticated %}
<li><a href="#" id="profile">{{user.username}}</a> | </li>
{% endif %}
<li><a href="javascript:madrona.editors[0].panel.showUrl('/disclaimer/',{});" id="disclaimer">disclaimer</a> | </li>
<li><a href="#" id="help">help</a> | </li>
<li><a href="#" id="about">about</a> | </li>
{% if user.is_authenticated %}
<li><a href="{% url user_signout %}">sign out</a></li>
{% else %}
<li><a href="#" id="register">register</a> | </li>
<!-- <li><a href="{% url user_signin %}" id="signin">sign in</a></li> -->
<li><a href="#" id="signin">sign in</a></li>
{% endif %}                
{% endblock metanavigation %}
{% block meta_navigation_list_append %}{% endblock %}
            
{% block tabs %}
{% if user.is_authenticated %}
<li><a href="#MyShapes"><span>My Shapes</span></a></li> 
<li><a href="#SharedShapes"><span>Shared With Me</span></a></li>             
{% endif %}
{% endblock tabs %}

{% block shapeDefinitionPanelManipulators %}
<div class="manipulators" style="display:none;">
    <h3>Optionally exclude any of the following regions from your Area of Inquiry</h3>
    {#  These divs get populated in media/manipulators/js/manipulators.js #}
    <div class="requiredManipulators"> </div>
    <div class="optionalManipulators"> </div>
    <hr />
</div>
{% endblock shapeDefinitionPanelManipulators %}


{% block shapeDefinitionPanelBeforeManipulatorContent %}   
The following clipping operations were performed on your shape:                 
{% endblock shapeDefinitionPanelBeforeManipulatorContent %}

{% block shapeDefinitionPanelAfterManipulatorContent %}     
If you ever need to change your shape, we also keep a copy of the lines you draw, so you will always have the un-clipped version for editing.
<br><br>
{% endblock shapeDefinitionPanelAfterManipulatorContent %}
